<!DOCTYPE HTML>
<html lang="cn" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
  <%include("/common/header.html",{title:''}){}%>
  <title>数据配置</title>
  <style>

  </style>
</head>
<script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=IENn7ABARjQIkTeAKyh80VTkg2jYXf3K"></script>
<body>

<div class="x-nav" style="margin: 20px auto auto 15px;">
      <span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
        <a href="javascript:">首页</a><span lay-separator="">/</span>
        <a><cite>数据配置</cite></a>
      </span>
  <a class="layui-btn layui-btn-primary layui-btn-small" style="margin: -5px 14px 0px 0px;float:right;"
     href="javascript:location.replace(location.href);" title="刷新">
    <i class="layui-icon layui-icon-refresh-3"></i>
  </a>
</div>
<div style="padding: 20px;">
  <h2 class="layui-colla-title">${session.project.projectName}</h2>
  <div class="layui-row layui-col-space15">
    <input type="hidden" value="${session.om_user.enterprise.id}" id="eid" name="e_id">
    <div class="layui-col-md4">
      <div class="layui-card">
        <div class="layui-card-body">
          <div id="test12" class="demo-tree-more"></div>
        </div>
      </div>
    </div>
    <div class="layui-col-md8" style="display: none" id="pianqu">
      <div class="layui-card">
        <div class="layui-card-header"><h1 id="projectName"></h1></div>
        <div class="layui-card-body">
          <h3 id="comName">公司名</h3>
          <h3>公司负责人:${session.om_user.name}&nbsp;&nbsp;&nbsp;&nbsp;电话:${session.om_user.telePhone}&nbsp;&nbsp;&nbsp;&nbsp;时间:${session.om_user.createDate}</h3>
          <button class="layui-btn layui-btn layui-btn-sm" id="test1"><i class="layui-icon layui-icon-add-1"></i>设置数据点
          </button>
        </div>
      </div>
    </div>
    <div class="layui-col-md6" style="display: none" id="pianqu2">
      <div class="layui-card">
        <div class="layui-card-header"><h1 id="projectName2"></h1></div>
        <div class="layui-card-body">
          <h3 id="dataname"></h3>
          <button class="layui-btn layui-btn layui-btn-sm" id="test3"><i class="layui-icon layui-icon-add-1"></i>修改数据点
          </button>
          <button class="layui-btn layui-btn layui-btn-sm" id="test4"><i class="layui-icon layui-icon-add-1"></i>删除数据点
          </button>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- 弹出编辑数据点 -->
<div class="layui-form" lay-filter="layuiadmin-form-useradmin"
     id="layuiadmin-form-useradmin"
     style="padding: 15px;display: none">
  <div class="layui-tab">
    <ul class="layui-tab-title">
      <li class="layui-this">数据配置</li>
    </ul>
    <div class="layui-tab-content">
      <div class="layui-tab-item layui-show">
        <form class="layui-form" action="" lay-filter="component-form-element" id="myForm1">
          <input type="hidden" value="${session.project.id}" name="bbbbid" id="bbbbid">
          <input type="hidden"  name="ensid" id="ensid">
          <input type="hidden" name="id" id="id">
          <div class="layui-form-item">
            <label class="layui-form-label">项目编号*</label>
            <div class="layui-input-inline">
              <input type="text" name="name" id="pName" placeholder="" readonly class="layui-input">
            </div>
          </div>
          <div class="layui-form-item">
            <label class="layui-form-label">节点名称*</label>
            <div class="layui-input-inline">
              <input type="text" name="dataName" id="dataNames" lay-verify="required" placeholder="请输入节点名称" class="layui-input">
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">通道号*</label>
            <div class="layui-input-inline">
              <input type="text" name="com" id="com" placeholder="请输入通道号"  lay-verify="required" class="layui-input">
            </div>
          </div>

          <div class="layui-form-item">
            <label class="layui-form-label">设备编号*</label>
            <div class="layui-input-inline">
              <select lay-filter="equipment" lay-verify="required" name="equipment" id="equipment">
                <option value="">请选择</option>

              </select>
            </div>
          </div>
          <div class="layui-form-item">
            <label class="layui-form-label">数据类型*</label>
            <div class="layui-input-inline">
              <select lay-filter="dataType" lay-verify="required" name="dataType" id="dataType">
                <option value="">请选择</option>

              </select>
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">舒适上限*</label>
            <div class="layui-input-inline">
              <input type="text" name="upperlimit" lay-verify="required" lay-verify="upperlimit" id="upperlimit" placeholder="请输入舒适上限" class="layui-input">
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">舒适下限*</label>
            <div class="layui-input-inline">
              <input type="text" name="lowerlimit" lay-verify="required" lay-verify="lowerlimit" id="lowerlimit" placeholder="请输入舒适下限" class="layui-input">
            </div>
          </div>
          <input type="hidden" name="upperlimitcolor"  value="#009688" id="upperlimitcolor" placeholder="请输入舒适上限颜色" class="layui-input">
          <input type="hidden" name="lowerlimitcolor" value="#009688" id="lowerlimitcolor" placeholder="请输入舒适下限颜色" class="layui-input">
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">告警范围高*</label>
            <div class="layui-input-inline">
              <select id="gjfwyz" name="gjfwyz" lay-verify="required">
                <option value="">请选择</option>
                <option value=">"> ></option>
                <option value="<"> <</option>
                <option value=">="> >=</option>
                <option value="<="> <=</option>
                <option value="="> =</option>
              </select>
            </div>
            <div class="layui-input-inline">
              <input type="text" lay-verify="required" name="gjfw" id="gjfw" placeholder="告警范围高..." class="layui-input">
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">告警范围中*</label>
            <div class="layui-input-inline">
              <select name="qwcbyz" id="qwcbyz" lay-verify="required">
                <option value="">请选择</option>
                <option value=">"> ></option>
                <option value="<"> <</option>
                <option value=">="> >=</option>
                <option value="<="> <=</option>
                <option value="="> =</option>
              </select>
            </div>
            <div class="layui-input-inline">
              <input type="text" name="qwcb" id="qwcb" lay-verify="required" placeholder="告警范围中..." class="layui-input">
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label" style="width: 120px">告警手机号01*</label>
            <div class="layui-input-inline">
              <input type="text" name="phone01"  id="phone01" placeholder="请输入告警手机号" class="layui-input">
            </div>
          </div>
          <div class="layui-form-item layui-form-text">
            <label class="layui-form-label" style="width: 120px">告警手机号02*</label>
            <div class="layui-input-inline">
              <input type="text" name="phone02"  id="phone02" placeholder="请输入告警手机号" class="layui-input">
            </div>
          </div>

          <div class="layui-form-item">
            <div class="layui-input-block">
              <button class="layui-btn" lay-submit="" lay-filter="component-form-element">保存数据点</button>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
<script id="demo" type="text/html">
  <option value="">请选择</option>
  {{#  layui.each(d.list, function(index, item){ }}
  <option {{d.depart== item.id?"selected":""}} value="{{ item.id }}">{{ item.d_name }}</option>
  {{#  }); }}
  {{#  if(d.list.length === 0){ }}
  <option disabled value="">无</option>
  {{#  } }}
</script>

<script id="demo2" type="text/html">
  <option value="">请选择</option>
  {{#  layui.each(d.list, function(index, item){ }}
  <option {{d.equip== item.id?"selected":""}} value="{{ item.id }}">{{ item.e_name }}</option>
  {{#  }); }}
  {{#  if(d.list.length === 0){ }}
  <option disabled value="">无</option>
  {{#  } }}
</script>

<%include("/common/foot.html"){}%>
<script>
  layui.use(['index', 'table', 'form', 'tree', 'layer', 'element', 'util', 'laydate', 'layedit', 'AjaxCommon', 'AliangLayui'], function () {
    var $ = layui.$;
    var table = layui.table;
    var form = layui.form;
    var laydate = layui.laydate;
    var AjaxCommon = layui.AjaxCommon;
    var AliangLayui = layui.AliangLayui;
    var element = layui.element;
    var util = layui.util;
    var tree = layui.tree;
    var layer = layui.layer;
    var title = "设置数据点";
    var findAll_url = "system/dataConfig/findAll.jhtml";
    var update_url = "system/dataConfig/save.jhtml";
    var updatadata = "system/dataConfig/update.jhtml";
    var index;//定义建立富文本编辑器全局变量
    var layedit;//定义富文本编辑器layedit全局变量

    //初始化修改页面
    var findArea_url = "system/dataConfig/getArea.jhtml";

    $.ajax({
      url: findArea_url,
      type: "POST",
      data: {
        "departid": Number(${session.project.id})
      },
      success: function (ret) {
        console.log(JSON.stringify(ret));
        var obj = [];
        if (ret) {
          obj = JSON.parse(JSON.stringify(ret).replace(/projectName/g, "title").replace(/departProjectData/g, "children").replace(/dataName/g, "title"));
        }

        //基本演示
        tree.render({
          elem: '#test12'
          , data: obj
          , showCheckbox: false  //是否显示复选框
          , id: 'demoId1'
          , onlyIconControl: true
          , showLine: false  //是否开启连接线
          , isJump: true //是否允许点击节点时弹出新窗口跳转
          , click: function (obj) {
            console.log(obj.data.hasOwnProperty("children"));
            if (!obj.data.hasOwnProperty("children")) {
              //子节点
              $("#pianqu2").show();
              $("#pianqu").hide();
              var data = obj.data;  //获取当前点击的节点数据
              var arr = [];
              // alert(JSON.stringify(data))
              $("#dataname").text(data.title);
              $("#id").val(data.id);
              $("#pName").val(data.name);
              $("#dataNames").val(data.title);
              /*     $("#equipment").val(data.equipment.id);
                   $("#dataType").val(data.dataType.id);*/
              $("#com").val(data.com);
              /*  data.departProjectData.forEach(function (res) {
                  arr.push(res.id);
                });*/
            } else {
              //父节点
              $("#pianqu").show();
              $("#pianqu2").hide();
              var data = obj.data;  //获取当前点击的节点数据

              var arr = [];
              $("#comName").text(data.enterprise.departName);
              $("#projectName").text(data.title);
              $("#pName").val(data.title);
              $("#ensid").val(data.id);
              /* data.departProjectData.forEach(function (res) {
                 arr.push(res.id);
               });*/
            }


            tree.setChecked('demoId1', [arr]);
            form.render();
          }
        });


      },
      error: function (jqXHR, textStatus, errorThrown) {
        alert(jqXHR);
        alert(textStatus);
        alert(errorThrown);
        var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
        layer.open({
          title: "错误信息",
          type: 2,
          content: "base/error.jhtml?info=" + estr,
          btn: ['关闭'] //可以无限个按钮
        });
      }
    });
    form.verify({
      upperlimit: function (value, item) { //value：表单的值、item：表单的DOM对象
        var patt1 = /^\d+$/;
        var patt2 = /^\d+\.\d+$/;
        if (patt1.test(value)) {
        } else if (patt2.test(value)) {
        } else {
          return '必须输入整型数字或者小数型数字';
        }
      },
      lowerlimit: function (value, item) { //value：表单的值、item：表单的DOM对象
        var patt1 = /^\d+$/;
        var patt2 = /^\d+\.\d+$/;
        if (patt1.test(value)) {
        } else if (patt2.test(value)) {
        } else {
          return '必须输入整型数字或者小数型数字';
        }
      }
    });
    function getCheckedId(jsonObj) {
      var id = "";
      $.each(jsonObj, function (index, item) {
        if (id != "") {
          id = id + "," + item.id;
        } else {
          id = item.id;
        }
        var i = getCheckedId(item.children);
        if (i != "") {
          id = id + "," + i;
        }
      });
      return id;
    }


    // function loadData(data) {
    //     return ret;
    // }


    var findDataType_url = "system/dataConfig/findAll.jhtml";
    var findEquip_url = "system/dataConfig/findEquip.jhtml";
    var delent_url = "system/dataConfig/delent.jhtml";
    var eid = Number($("#eid").val());
    $("#test1").click(function (data) {
      initUpdate(0);
    });

    $("#test3").click(function (data) {
      initUpdate(data);
    });

    $("#test4").click(function (data) {
      $.ajax({
        url: delent_url,
        type: "POST",
        data: {
          "id":$("#id").val()
        },
        success: function (ret) {
          layer.msg('删除成功', {icon: 6});
          window.location.reload();
        },
        error: function (jqXHR, textStatus, errorThrown) {
          var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
          layer.open({
            title: "错误信息",
            type: 2,
            content: "base/error.jhtml?info=" + estr,
            btn: ['关闭'] //可以无限个按钮
          });
        }
      });
    });

    //数据配置
    form.on('submit(component-form-element)', function (data) {
      var info = data.field;
      console.log(JSON.stringify(info));
      postUpdateOne(info);
      return false;
    });


    //弹出修改页面调用初始化数据方法
    function initUpdate(data) {
      layer.open({
        type: 1,
        title: title,
        area: ["100%", "100%"],
        content: $('#layuiadmin-form-useradmin'),
        cancel: function (index, layero) {//取消事件
          location.replace(location.href);　//layer.open关闭刷新
        },
        success: function (layero, index) {
          layer.iframeAuto(index);
        }
      });

      if ($("#id").val()&&data!=0) {
        $.ajax({
          url: updatadata,
          type: "POST",
          data: {
            "id": $("#id").val()
          },
          success: function (ret) {
            console.log(ret);
            $("#equipment").val(ret.equipment.id);
            $("#dataType").val(ret.dataType.id);
            $("#gjfwyz").val(ret.threshold.gjfwyz);
            $("#gjfw").val(ret.threshold.gjfw);
            $("#qwcbyz").val(ret.threshold.qwcbyz);
            $("#qwcb").val(ret.threshold.qwcb);
            $("#zcfwyz").val(ret.threshold.zcfwyz);
            $("#zcfw").val(ret.threshold.zcfw);
            $("#upperlimit").val(ret.upperlimit);
            $("#lowerlimit").val(ret.lowerlimit);
            $("#upperlimitcolor").val(ret.upperlimitcolor);
            $("#lowerlimitcolor").val(ret.lowerlimitcolor);
            $("#phone01").val(ret.phone01);
            $("#phone02").val(ret.phone02);
            form.render();
          },
          error: function (jqXHR, textStatus, errorThrown) {
            var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
            layer.open({
              title: "错误信息",
              type: 2,
              content: "base/error.jhtml?info=" + estr,
              btn: ['关闭'] //可以无限个按钮
            });
          }
        });
      }


      $.ajax({
        url: findDataType_url,
        type: "POST",
        data: {
          "eid": eid
        },
        success: function (ret) {
          var laytpl = layui.laytpl;
          var rets = { //数据
            "list": ret.obj
          };
          laytpl($("#demo").html()).render(rets, function (html) {
            $("#dataType").html(html);
          });
          form.render();
        },
        error: function (jqXHR, textStatus, errorThrown) {
          var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
          layer.open({
            title: "错误信息",
            type: 2,
            content: "base/error.jhtml?info=" + estr,
            btn: ['关闭'] //可以无限个按钮
          });
        }
      });

      $.ajax({
        url: findEquip_url,
        type: "POST",
        data: {
          "eid": eid
        },
        success: function (ret) {
          // alert(JSON.stringify(ret))
          var laytpl = layui.laytpl;
          var rets = { //数据
            "list": ret.data
          };
          laytpl($("#demo2").html()).render(rets, function (html) {
            $("#equipment").html(html);
          });
          form.render();
        },
        error: function (jqXHR, textStatus, errorThrown) {
          var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
          layer.open({
            title: "错误信息",
            type: 2,
            content: "base/error.jhtml?info=" + estr,
            btn: ['关闭'] //可以无限个按钮
          });
        }
      });

      layedit = layui.layedit;
      //建立编辑器
      index = layedit.build('introduce', {
        tool: ['strong', 'italic', 'underline', 'del', '|',
          'left', 'center', 'right', '|',
          'link', 'unlink'],
        height: 280
      });
      //富文本表单验证
      form.verify({
        introduce: function (value) {
          var val = layedit.getText(index);
          //alert(val.length)
          if (val.length < 6) {
            return '内容至少6个字符'
          }
        }
      });
      //如果是添加则重置表单，如果是编辑则给表单赋值
      if (data == 0 || data == null) {
        $('#myform')[0].reset();

      } else {
        // layui.form.val("component-form-element", loadData(data));
      }


    }

    //点击每行右工具栏“操作”里面按钮效果
    table.on('tool(LAY-user-manage)', function (obj) {
      var data = obj.data;
      if (obj.event === 'edit') {
        // initUpdate(data);
      } else if (obj.event === 'view') {

      } else if (obj.event === 'del') {
        layer.confirm('删除以后数据将不能恢复，确定删除吗？', function (index) {
          // alert(data.id);
          postDelete(data.id);
        });
      }
    });


    //ajax提交删除内容
    window.postDelete = function (id) {

    };
    //数据配置
    window.postUpdateOne = function (data) {

      var formData = new FormData();
      formData.append("data", JSON.stringify(data));
      // formData.append("file", $("input[name='file']")[0].files[0]);
      formData.append("ensid", $("#ensid").val());
      formData.append("bbbbid", $("#bbbbid").val());
      $.ajax({
        url: update_url,
        type: "POST",
        //traditional:true,
        data: formData,
        processData: false,
        contentType: false,
        success: function (data) {
          if (data.code == 0) {
            layer.closeAll();
            layer.msg(data.msg, {time: 600, icon: 1}, function () {
              //table.reload('listReload');
              location.replace(location.href);
            });
          } else {
            layer.msg(data.msg, {icon: 5});
          }
        },
        error: function (jqXHR, textStatus, errorThrown) {
          console.log(jqXHR, textStatus, errorThrown);
          var estr = "Page:" + window.location.pathname + ",Function:postUpdate()";
          layer.open({
            title: "错误信息",
            type: 2,
            content: "base/error.jhtml?info=" + estr,
            btn: ['关闭'] //可以无限个按钮
          });
        }
      });
    };
  });

</script>

</body>

</html>
